<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JS ES6 class类</title>
</head>

<body>

</body>

</html>
<script>
  //ES5 function 方式来创建对象
  // function Person(){} prototype

  //ES6 class 类方式来创建对象
  // ES5 prototype 继承 ES6 extends 继承 

  //   class类
  // class（类声明）
  // 重复声明一个类会引起类型错误。
  // 类表达式定义一个类后再声明一个类同样会报错
  // constructor 创建 和 初始化 class创建对象的特殊方法，一个类中只能有 一个 构造方法constructor
  class Person {
    //属性
    nickname = ''
    age = ''
    sex = ''
    money = ''

    //静态属性
    static names = '静态属性'

    //构造函数 是在对象被初始化的时候，立刻自动执行的函数
    //初始化： new Person('张三', 20, '男', 0)
    constructor(nickname, age, sex, money) {
      this.nickname = nickname
      this.age = age
      this.sex = sex
      this.money = money

    }

    //方法
    work() {
      this.money += 1000
      return `${this.nickname} 正在工作`
    }

    //静态方法
    static sleep() {
      return '静态方法'
    }
  }

  var Persons = new Person('张三', 20, '男', 0);
  console.log(Persons)
  //静态属性的调用，不需要创建实例，直接使用 对象名.属性名
  console.log(Person.names)
  //静态方法的调用，不需要创建实例，直接使用 对象名.静态方法名()
  console.log(Person.sleep())

  //定义子类
  class Son extends Person {
    //存在覆盖的现象  子类会 覆盖父类的 constructor
    constructor(nickname, age, sex, money) {
      //父类的继承
      super(nickname, age, sex, money)

      console.log('覆盖了父类的')

      //自定义一个属性
      // es5 Object.defineProperties()
      // es6 class 
      // height == _height
      this.height = ''
    }
    //给height属性定义getter方法
    get height() {
      console.log('在读取height属性的时候')
      return `${this.nickname} 身高为：${this._height}`
    }

    set height(value) {
      console.log('在修改的时候会调用这个setter')
      this._height = value
    }
  }
  //调用子类
  var demo = new Son('子类', 20, '男', 2000)
  console.log(demo)
  //打印继承过来的属性
  // console.log(demo.nickname)
  demo.height = 20
  console.log(demo.height)


  //   super关键字 super代表的是父类的构造函数 至多出现 一次
  // 必须在使用 this 关键字之前使用
  // super关键字 也可以用来调用父对象上的函数。
  // extends ，用来创建一个子类继承另一个类
  // JavaScript super关键字: 
  // https://blog.csdn.net/weixin_49087505/article/details/121721031

  class Per {
    constructor(name) {
      this.name = name;
      this.sex = "男";
    }
  }
  class Student extends Per {
    constructor(name, age) {
      super(name);
      this.age = age;
    }
  }
  let s = new Student("张三", 11);
  console.log(s.name);
  console.log(s.age);
  console.log(s.sex);


  //调用对象
  // var obj = new Person('张三', 20, '男', 0)
  // console.log(obj)

  // //调用属性和方法
  // console.log(obj.nickname)
  // console.log(obj.work())

  // //静态属性和方法 不用实例化就可以调用
  // console.log(Person.names)
  // console.log(Person.sleep())


</script>